<template>
    <view class="gift-purchase">
    <view class="header">
      <view><uni-status-bar></uni-status-bar></view>

      <view class="search-box flex-cn">
        <view class="navbar-left flex-cn" style="flex: 1" @click="backHome">
          <view
            style="width: 100rpx;color: #fff; text-align: center"
            class="qh-rt-single qh-rt-zuo-zuo navbar-back-icon"
          >
          </view>
        </view>

        <view
          style="
            height: 80rpx;
            line-height: 80rpx;
            font-size: 36rpx;
            font-family: '.PingFang SC, PingFang SC';
            display: flex;
            justify-content: center;
            align-content: center;
            flex: 1;
            color: #fff;
            font-weight: 600;
          "
        >
          {{ title }}
        </view>
        <view style="width: 320rpx; flex: 1"></view>
      </view>
    </view>

   <view class="offline-center-content" >
    <view class="offline-center" >
        <view class="store-intro">
            <view class="intro-title">【时福全球购】</view>
            <text class="intro-text">
                时福全球购，2015年创立于福建省厦门市，专注于汇聚全球优质商品。我们连接世界供应商，提供食品、美妆、家居等多品类精选好物，确保品质卓越，服务贴心。在线购物平台便捷高效，让全球好物触手可及。时福全球购，让每一次购物都满载幸福。
            </text>
        </view>

        <view style="display: flex;justify-content: center;align-items: center; ">
            <image style="width: 638rpx; height:360rpx;" src="https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/173553970467723bf8a561c.png"></image>

        </view>

        <view class="image-grid">
            <view class="grid-item" v-for="(item, index) in storeImages" :key="index">
                <image :src="item" mode="aspectFill" class="store-image" />
            </view>
        </view>
    </view>
   </view>

</view>
</template>

<script>
export default {
    data() {
        return {
            title: '线下门店',
            isScrolled: false,
            storeImages: [
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096360676b78285a9bc.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096372676b78343a8fa.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096380676b783c6deaf.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096390676b784667aba.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096399676b784f59c80.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096407676b7857587ec.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096414676b785e2de2d.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096422676b78662e6c4.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096429676b786d73c7e.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096437676b787547f32.png', 
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096444676b787c9d541.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096453676b788563a4b.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096463676b788f0f03a.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096470676b7896510b4.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096477676b789df3074.png',
                'https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735096487676b78a74ffbc.png',
               
               
            ]
        }
    },
    methods: {
        backHome() {
            uni.navigateBack();
        },
    },
}
</script>

<style lang="scss" scoped>
.offline-center-content{
    // height: 100vh; 
    overflow-y: auto;
    padding-bottom: env(safe-area-inset-bottom);

}

.offline-center{
    background-image: url('https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/1735090712676b6218c1edf.png');
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;   
    margin: 20rpx;
 
}

.gift-purchase {
  height: 100vh;  
  overflow-y: auto;  
  width: 100%;
  padding-bottom: 24rpx;
}

.header{
    background-color: #fff;
    position: sticky;
    top: 0px;
    z-index: 99;
    background-color: #f5f5f5;
  background-image: url('https://safood-1317438654.cos.ap-guangzhou.myqcloud.com/tempImage/173494563867692b66b028b.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.store-intro {
    padding: 50rpx 50rpx 10rpx 50rpx;
}

.intro-title {
    font-size: 36rpx;
    font-weight: 600;
    color: #DA5C47;
    text-align: center;
    margin-bottom: 30rpx;
}

.intro-text {
    font-size: 28rpx;
    line-height: 1.6;
    color: #333;
    text-indent: 2em;
    display: block;
    padding: 0 10rpx;
    white-space: pre-wrap;
}

.image-grid {
    padding: 26rpx;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10rpx;
}

.grid-item {
    width: 300rpx;
    height: 200rpx;
    border-radius: 12rpx;
    overflow: hidden;
}

.store-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
</style>
